<template>
	<view class="move">
		<view class="ey same">
			<text class="car">车牌号</text>
			<view class="put">
				<up-input placeholder="请输入车牌号" border="surround" v-model="carnum" @blur="checknum"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">身份证号</text>
			<view class="put">
				<up-input placeholder="请输入身份证号" border="surround" v-model="idcard" @blur="checkid"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">联系电话</text>
			<view class="put">
				<up-input placeholder="请输入联系电话" border="surround" v-model="phone" @blur="checkphone"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">省</text>
			<view class="put">
				<up-input placeholder="请输入省份" border="surround" v-model="province" @blur="checkprovince"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">市</text>
			<view class="put">
				<up-input placeholder="请输入市" border="surround" v-model="city" @blur="checkcity"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">区</text>
			<view class="put">
				<up-input placeholder="请输入区" border="surround" v-model="area" @blur="checkarea"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">详细地址</text>
			<view class="put">
				<up-input placeholder="请输入详细地址" border="surround" v-model="address" @blur="checkaddress"></up-input>
			</view>
		</view>

		<view class="ey same">
			<text class="car">现场照片</text>
			<view class="put">
				<u-upload :fileList="fileList1" name="img" multiple :maxCount="1" @afterRead="afterRead"
					@delete="deletePic" />
			</view>
		</view>

		<up-button type="primary" text="提交" @click="getsub"></up-button>

	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		movecart
	} from '@/api/parkApi.js'

	const fileList1 = ref([]) //图片路径 显示在页面上
	const carnum = ref() //车牌号
	const idcard = ref() //身份证号
	const phone = ref() //电话
	const province = ref() //省份
	const city = ref() //市
	const area = ref() //区
	const address = ref() //详细地址 
	const imgurl = ref() //图片地址

    //失去焦点触发
	const check=(val)=>{
			
		if(val==undefined){
			uni.showToast({
				title:'内容不能为空',
				icon:'error'
			})
		}
	}
	
    //失去焦点检查车牌
	const checknum=()=>{
		check(carnum.value)
	}
	
	//失去焦点检查身份
	const checkid=()=>{
		check(idcard.value)
	}

    //失去焦点检查电话
    const checkphone=()=>{
    	check(phone.value)
    }
	
	//失去焦点检查省
	const checkprovince=()=>{
		check(province.value)
	}

    //失去焦点检查市
    const checkcity=()=>{
    	check(city.value)
    }
	
	//失去焦点检查区
	const checkarea=()=>{
		check(area.value)
	}
	
	//失去焦点检查详细地址
	const checkaddress=()=>{
		check(address.value)
	}


	//新增照片
	const afterRead = (e) => {
		
		imgurl.value = e.file[0].url //将图片地址保存
		// fileList1.value.push({url:e.file[0].url})   多张图片
		fileList1.value = [{
			url: e.file[0].url
		}]                        //将图片显示到页面上
	}

	//删除照片
	const deletePic = (e) => {
		fileList1.value.splice(e.index, 1)
	}

	//提交申请
	const getsub = async () => {

		if (carnum.value == undefined || idcard.value == undefined || phone.value == undefined || province.value ==
			undefined || city.value==undefined || area.value==undefined || address.value==undefined ||imgurl.value==undefined) {
             uni.showToast({
             	title:'内容不能为空',
				icon:'error'
             })
             return;
		}
		//图片先提交变成网络地址
		uni.uploadFile({
			url: 'http://124.93.196.45:10001/prod-api/common/upload', //接口地址
			filePath:imgurl.value,
			name: 'file',
			header:{
			"Authorization":uni.getStorageSync('token')
			},
			formData:{},
			
			success: async(res) => {
             
			 if(res.statusCode==200){
				  //成功返回 拿到网络地址
				let imgdata= JSON.parse(res.data) 
				console.log(imgdata.fileName);
				
				 //掉申请挪车接口
				let res1 = await movecart({
					header:{
						"Authorization":uni.getStorageSync('token')
					},
					data:{
						plateNo:carnum.value,
						idCard:idcard.value,
						tel:phone.value,
						province:province.value,
						city:city.value,
						area:area.value,
						address:address.value,
						photo:'http://124.93.196.45:10001/prod-api/'+imgdata.fileName   //图片进行拼接 基路径
					}
				})
				console.log(res1);
				if(res1.code==500){
					uni.showToast({
						title:res1.msg,
						icon:'error'
					})
				
				}else if(res1.code==200){
					uni.showToast({
						title:'提交成功'
					})
					
					uni.navigateTo({
						url:'/pages/park/cart/cart'
					})
					
				}else{
					//静态数据
					
					uni.showToast({
						title:'提交成功'
					})
					
					uni.navigateTo({
						url:'/pages/park/cart/cart'
					})
					
				}
				
				
			 }
				
			}
		})


	}
	
</script>
<style lang="scss">
	.move {
		padding: 8px 14px;

		.ey {
			display: flex;
			align-items: center;

			.car {
				flex: 1;
				font-size: 18px;
				font-weight: 700;
				text-align-last: justify;
				margin-right: 14px;

			}

			.put {
				flex: 3;
			}
		}

		.same {
			margin: 10px 0px;
		}

		::v-deep .u-button {
			margin: 10px 0px;
		}
	}
</style>